import {
  Button,
  Col,
  Form,
  FormItem,
  InputNumber,
  message,
  Modal,
  Row,
  Spin
} from 'ant-design-vue'
import { defineComponent, onMounted, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'

import { riverApi, xhImformationApi } from '@/apis'
import { OrderDetailItem } from '@/apis/orderTypes'
import { BaseInfoDetail } from '@/apis/riverTypes'
import { type ProTableProps, type ProTableRef, ProTable } from '@/components'
import { TABLE_FORMAT } from '@/constants'
import { useBack } from '@/hooks/useBack'
import { formatDate } from '@/utils'

export default defineComponent({
  name: 'ConfigurationRecord',
  setup() {
    const route = useRoute()
    const router = useRouter()
    const data = ref({} as BaseInfoDetail)
    const optionItemCur = ref({} as OrderDetailItem)
    const loading = ref(false)
    const tableConfig = ref({
      fixedHeight: true,
      options: {
        border: true,
        align: 'center',
        columnConfig: {
          minWidth: 150,
          resizable: true
        },
        columns: [
          {
            title: '当前登录账号',
            field: 'updateUser',
            width: 180
          },
          {
            title: '修改时间',
            field: 'updateTime',
            width: 250,
            formatter: [TABLE_FORMAT.Date, 'yyyy-MM-dd HH:mm:ss']
          },
          {
            title: '修改内容',
            field: 'remark'
          }
        ],
        pagerConfig: {
          pageSize: 15
        },
        proxyConfig: {
          form: true,
          props: {
            result: 'dataList',
            total: 'page.totalCount'
          },
          ajax: {
            query: async ({ page, form }) => {
              const data = await riverApi.getConfigurationLog({
                pageSize: page.pageSize,
                currentPage: page.currentPage,
                ...form
              })
              for (let i = 0; i < data.dataList.length; i++) {
                console.log(data.dataList[i].remark.replaceAll('字段:', ''))
                data.dataList[i].remark = data.dataList[i].remark.replaceAll(
                  '字段:',
                  ''
                )
              }
              return data
            }
          }
        }
      }
    } as ProTableProps)
    return {
      data,
      loading,
      tableConfig
    }
  },
  render() {
    return (
      <div>
        <ProTable ref="tableRef" v-slots={{}} {...this.tableConfig} />
      </div>
    )
  }
})
